<?php
require_once "common.php";
//读取title
$cp = 'product';

?>
<?php include_once 'header.php'; ?>
	<div id="main">
		<div id="s-4"><img src="images/kinso_03.jpg" alt="记事本厂家,专业本册厂家,笔记本厂家,定制记事本厂家" /></div>
		<div id="s-5">
		<?php include_once 'left_list.php'; ?>
			<div id="s-5-r">
				<h2><img src="images/kinso_10.png" alt="产品中心 - 记事本厂家,专业本册厂家,笔记本厂家,定制记事本厂家" /></h2>
				<div class="s-5-r-1">
					<div id="boxpro">
   						<div id="p-p"><a href="javascript:void(0)">上一张</a></div>
   						<div id="p-n"><a href="javascript:void(0)">下一张</a></div>
						<img src="" alt="记事本厂家,专业本册厂家,笔记本厂家,定制记事本厂家" id="bigPic" />
					</div>
					<div id="dian"></div>
					<br />
                    <div class="pro-name">名称：<tt id="name"></tt></div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript" src="images/jquery-1.4.2.min.js"></script>
	<script type="text/javascript">
$(function(){
	
	var suzu = Array(<?php foreach($product as $key => $p){ if($key != 0) echo ","; echo "\"".$p['img'][0]['img_big']."\""; }?>);
	var name = Array(<?php foreach($product as $key => $p){ if($key != 0) echo ","; echo "\"".$p['name']."\""; }?>);

	var len = suzu.length;
	if(len){
	for(var a=0; a< len; a++){
		$("#dian").append("<tt>●</tt>");
	}
	$("#dian tt").first().addClass("show");
	$("#bigPic").attr("src",suzu[0]);
	$("#name").html(name[0]);
	$("#dian tt").click(function(){
		var index = $("#dian tt").index(this);
		$("#bigPic").attr("src",suzu[index]);
		$("#name").html(name[index]);
		$("#dian tt").removeClass("show");
		$("#dian tt").eq(index).addClass("show");
	})
	
	$("#p-p a").click(function(){
		
		for(var i = 0; i<len; i++){
			if(suzu[i] == $("#bigPic").attr("src")){
				if(i == 0){
					alert("第一张");
				}else{
					$("#bigPic").attr("src",suzu[i-1]);
					$("#name").html(name[i-1]);
					$("#dian tt").removeClass("show");
					$("#dian tt").eq(i-1).addClass("show");
					return;
				}
			}
		}
	})
	
	$("#p-n a").click(function(){
		for(var i = 0; i<len; i++){
			if(suzu[i] == $("#bigPic").attr("src")){
				if( i == len-1){
					alert("最后一张");
				}else{
					$("#bigPic").attr("src",suzu[i+1]);
					$("#name").html(name[i+1]);
					$("#dian tt").removeClass("show");
					$("#dian tt").eq(i+1).addClass("show");
					return;
				}
			}
		}
	})
	}else{
		$(".s-5-r-1").html("暂无产品！");
	}
})
</script>
<?php include_once 'footer.php'; ?>
